<template>
    <div style="background: #333;">
      <el-row :gutter="20" style="width: 60%;margin-left: 20%">
        <el-col :span="4"><div class="grid-content bg-purple">
            <ul style="width: 80px">
              <li class="m_header">关于我们</li>
              <li class="m_row"></li>
              <li>
                <a href="#/terrace?id=gsjj">公司简介</a>
              </li>
              <li>
                <a href="#/terrace?id=lxwm">联系我们</a>
              </li>
            </ul>
        </div></el-col>
        <el-col :span="4"><div class="grid-content bg-purple">
          <ul style="width: 80px">
            <li class="m_header">商务合作</li>
            <li class="m_row"></li>
            <li>
              <a href="#/terrace?id=sybgm">商业版购买</a>
            </li>
          </ul>
        </div></el-col>
        <el-col :span="4"><div class="grid-content bg-purple">
          <ul style="width: 80px">
            <li class="m_header">常见问题</li>
            <li class="m_row"></li>
            <li>
              <a href="#/terrace?id=rhgm">如何购买</a>
            </li>
          </ul>
        </div></el-col>
        <el-col :span="3"><div class="grid-content bg-purple"></div></el-col>
        <el-col :span="4"><div class="grid-content bg-purple">
          <ul style="width: 80px">
            <li class="m_header">官方微信</li>
            <li>
              <img src="https://static-dev.roncoo.com/course/b48eded5e31b4c0ab7a26ac9ad418cde.png" width="96px" height="96px"/>
            </li>
          </ul>
        </div></el-col>
      </el-row>
      <el-row style="width: 60%;margin-left: 20%">
        <el-col :span="24"><div style="">
          <hr width="91%"/>
        </div></el-col>
      </el-row>
      <el-row style="width: 60%;margin-left: 20%">
        <el-col :span="24"><div style="">
          <ul id="bul" >
            <li class="link_one">友情链接:</li>
            <li>
              <a href="https://www.roncoo.net/" target="_blank" title="领课网课">领课网课</a>
            </li>
            <li>
              <a href="https://edu.roncoo.net/" target="_blank" title="领课教育">领课教育</a>
            </li>
          </ul>
        </div></el-col>
      </el-row>
      <el-row style="">
        <el-col :span="24"><div style="background: #666666;text-align: center">
          <span style="color: white">Copyright © 2015-2020 广州市领课网络科技有限公司 版权所有</span>
        </div></el-col>
      </el-row>
      <div class="icp_num">
        <a href="https://www.roncoo.net/" target="_blank" class="lingke_link">领课教育云</a> 提供技术支持
        <span>&nbsp;|&nbsp;</span>
        <a href="http://www.beian.miit.gov.cn" target="_blank" class="c_ccc">粤ICP备16009964号</a>
        <span>&nbsp;|&nbsp;</span>
        <a
          href="http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=44010602005928"
          target="_blank"
          class="c_ccc"
        >
          <img src="" alt class="prn_icon" height="15px"/>&nbsp;粤公网安备 44010602005928号
        </a>
      </div>
    </div>
</template>

<script>
    export default {
        name: "Bottom"
    }
</script>

<style scoped>
  .grid-content {
    border-radius: 4px;
    min-height: 36px;
  }
  .m_row {
    width: 18px;
    height: 3px;
    background: #ccc;
  }
  .m_header{
    font-size: 20px;
    font-weight: bolder;
  }
  ul li{
    list-style-type: none;
    margin-bottom: 25px;
    color: #ccc;
  }
   a{
    color: #ccc;
    text-decoration:none;
  }
  #bul li{
    float: left;
    margin-left: 15px;
    margin-right: 15px;
  }
 .icp_num {
    line-height: 30px;
    text-align: center;
    color: #ccc;
    background-color: #333;
  }
  .icp_num .lingke_link {
    color: #ccc;
  }
</style>
